<template>
    <div class="page-hire-designers">
        <van-tabs v-model="active">
            <van-tab key="designer" title="设计师">
                <app-designers :data-source="designers"></app-designers>
            </van-tab>
            <van-tab key="works" title="作品">
                <app-works :data-source="works"></app-works>
            </van-tab>
        </van-tabs>
    </div>
</template>

<script>
import appWorks from '../../component/works'
import appDesigners from '../../component/designers'
import { worksList } from '../../api/works'
import { designerList } from '../../api/designer'
export default {
    name: 'designers',
    components: {
        appWorks, appDesigners
    },
    data(){
        return {
            active: 0,
            works: [],
            designers: [],
        }
    },
    methods: {
        getWorksList(){
            worksList({
                pageSize: 1000,
                pageNum: 1
            }).then(rsp => {
                if(rsp.code === 200){
                    this.works = rsp.data.list
                }
            })
        },

        getDesignerList(){
            designerList({
                pageNum: 1,
                pageSize: 100
            }).then(rsp => {
                if(rsp.code === 200){
                    this.designers = rsp.data.list
                }
            })
        }
    },
    created(){
        this.getDesignerList()
        this.getWorksList()
    }
}
</script>

<style lang="less">
.page-hire-designers{
    .van-tab--active{
        color: @primary;
    }
    .van-tabs__line{
        background-color: @primary;
    }
}
</style>


